<div id="content_header">
  <h3>Student Discounts</h3>
</div>

<div class="row">
    <div class="col-xs-6">
      <label for="keyword">SEARCH</label>
      <div class="row">
        <div class="col-md-12">
          <form class="form-vertical" ng-submit="searchStudent()">
            <div class="input-group">
              <input class="form-control" type="text" name="keyword" id="keyword" placeholder="Type Name or Student ID and press enter to search" ng-model="searchText">
              <span class="input-group-btn">
                <button class="btn btn-default" type="button">Go!</button>
                </span>
            </div>
          </form>
        </div>
      </div>
    </div>
    <div class="col-xs-6">
      <label>RESULTS</label>
      <div class="row">
        <div class="search-message">
          Found <span class="primary-color"><b>{{ (discounts | filter:searchKey).length }}</b></span> matched records
        </div>
      </div>
    </div>
</div>
<div class="row">
  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
    <table class="table table-hover">
      <thead>
        <tr>
          <th>Number</th>
          <th>Student</th>
          <th>Amount</th>
          <th>Validity</th>
          <th>Status</th>
        </tr>
      </thead>
      <tbody>
        <tr dir-paginate="discount in discounts | itemsPerPage: pagesize" total-items="totalItems">
          <td ng-bind-html="discount.Number | makeBold:searchKey"></td>
          <td>
            <div class="media">
              <a class="pull-left" href="#">
                <div class="media-object" data-src="holder.js/64x64" alt="64x64" style="width: 48px; height: 48px; background-color: #95A5A6;"></div>
              </a>
              <div class="media-body">
                <dl>
                  <dt>Name</dt>
                  <dd ng-bind-html="discount.Student.FullName | makeBold:searchKey"></dd>
                  <dt>Date of Birth</dt>
                  <dd>{{ discount.Student.DoB | date:'dd MMMM yyyy' }}</dd>
                </dl>
              </div>
            </div>
          </td>
          <td>
            <span ng-show="discount.AmountType === 0">{{ discount.Amount | currency: 'Rp. ' }}</span>
            <span ng-show="discount.AmountType === 1">{{ discount.Amount }}%</span>
          </td>
          <td>{{ discount.ValidFrom | date:'longDate' }} - {{ discount.ValidUntil | date:'longDate' }}</td>
          <td>
          <span class="label label-warning" ng-if="discount.HasBeenUsed">Used</span>
          <span class="label label-success" ng-if="!discount.HasBeenUsed">Available</span>
          </td>
        </tr>
      </tbody>
    </table>
    <dir-pagination-controls on-page-change="pageChanged(newPageNumber)" template-url="views/templates/dirPagination.tpl.html"></dir-pagination-controls>
  </div>
</div>